const LxPageContainer = {
  render(h) {
    return h(
      'div',
      {
        class: ['lx-page-container', 'size-full', 'bg-white', 'flex', 'flex-col']
      },
      [
        // Header 插槽
        this.$slots.header,

        // 主体区域
        h(
          'div',
          {
            class: ['flex-grow', 'flex', 'flex-row']
          },
          [
            // 侧边栏
            h(
              'div',
              {
                class: ['lx-page-sidebar', 'bg-[#f5f5f5]', 'flex-shrink']
              },
              this.$slots.sidebar
            ),

            // 内容区域
            h(
              'div',
              {
                class: ['lx-page-content', 'flex-grow']
              },
              this.$slots.content
            )
          ]
        )
      ]
    )
  }
}

export default LxPageContainer
